/* 全局默认样式 */
:root {
    --el-color-primary: #409eff; /* 主色调 */
    --el-color-success: #67c23a; /* 成功色 */
    --el-color-warning: #e6a23c; /* 警告色 */
    --el-color-danger: #f56c6c; /* 错误色 */
    --el-color-info: #909399; /* 信息色 */
    --el-bg-color: #ffffff; /* 背景色 */
    --el-text-color-primary: #303133; /* 主文本颜色 */
    --el-fill-color: #f0f2f5; /* 填充色 */
    --el-border-color: #dcdfe6; /* 边框颜色 */
  }
  
  /* 黑暗模式样式 */
.dark {
    --el-color-primary: #66b1ff;
    --el-color-success: #85ce61;
    --el-color-warning: #eda035;
    --el-color-danger: #f78989;
    --el-color-info: #c0c4cc;
    --el-bg-color: #141414;
    --el-text-color-primary: #d1d5db;
    --el-fill-color: #181818;
    --el-border-color: #2d3748;
  }
  
  .dark{
    background-color:var(--el-bg-color);
    
  }
  .dark .el-row{
 
    color:white;
  }

  .dark .title_text{
 
    color:#3b3b3b;
  }

  /* 具体组件的黑暗模式样式 */
.dark .el-button {
    
    width: 100%;
    height: 100%;
  }


  .dark .middle-2{
    background-color: #363636;
    border-radius: 5px;
    padding: 10px;
  }

 .dark .midele-3-bg{
  background-color: #363636;
 }
 
 /* 主页头部 */
 .dark .clickable-col {
  display: inline-block;
  padding: 5px;
  margin-top: 0px;
  border-radius: 4px;

  text-decoration: none;
  /* 去掉链接的下划线 */
  color: inherit;
  /* 继承父元素的颜色 */
  /* 轻微的黑色背景 */
  transition: background-color 0.3s ease;
  /* 平滑过渡背景色变化 */
}

.dark .clickable-col:hover {
  background-color: rgba(151, 113, 113, 0.3);
  /* 鼠标悬停时加深背景色 */
  
}
.dark .item {
  background-color: #474747;
  border-radius: 5px;
  padding: 0px;
  width: 80px;
  box-sizing: border-box;
  text-align: center;
}
.dark .dark_word{
  color:white;
}
.dark .dark_word2{
  color: white;
}

.dark .dark_bgcolor{
  background-color: #474747;
  color: white;
}
.dark .dark_bgcolor2{
  background-color: #292828;
  color: white;
}
.dark .dark_bgcolor3{
  background-color: #974141;
  color: white;
}
/* 小选项框中使用 */
.dark .dark_btbgcolor{
  background-color: #474646;
  color: var(--el-color-info);
}
.dark .dark_btbgcolor :hover{
  color: #474646;
}
.dark .el-table .even-row{
  background-color: #474646; /* 设置奇数行背景色 */
}
.dark .el-table .odd-row {
  background-color: #474646; /* 设置奇数行背景色 */
}

